<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <meta charset="utf-8">
        <title>Producto:El Juego de la Subasta</title>
        <meta name="description" content="Proyecto de Ingeniería del Software 2">
        <meta name="author" content="Grupo 9">
        <link rel="shortcut icon" href="img/images.ico"> 
        <!—[if lt IE 9]>
        <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]—>
        <link href="css/bootstrap.min.css" rel="stylesheet">
        <style>
            body { padding-top: 60px; }
        </style>
        <link href="css/bootstrap.css" rel="stylesheet">
        <link href="css/subastas.css" rel="stylesheet">        
    </head>
    <body>
        <script src="js/libs/jquery-1.9.0/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>
        <script src="http://localhost:6969/socket.io/socket.io.js"></script>
        <script src="js/interaccion_subastas.js"></script>

        <!--Cuenta atrás-->
        <script src="js/jquery.countdown.min.js"></script>

        <!-- Fixed navbar -->
        <div class="navbar navbar-default navbar-fixed-top" role="navigation">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a id="wHome" class="navbar-brand" href="index.html">El Juego de la Subasta</a>
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav navbar-left">
                        <li id="wBuscarProducto" class="hidden"><a href="resultadoBusquedaProducto.html">Buscar Producto</a></li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li id="wLogin" class="hidden"><a href="login.html">Login</a></li>
                        <li id="wLogout"><a href="logout.html" onclick="logout()">Logout</a></li>
                        <li id="wSignin" class="hidden"><a href="signin.html">Signin</a></li>
                        <li id="wPerfil" class="active"><a href="perfil.html">Perfil</a></li>
                        <li id="wOpciones" ><a href="opciones.html">Opciones</a></li>
                        <li id="wGestionUsuarios" class="hidden"><a href="gestionUsuarios.html">Gestión de Usuarios</a></li>
                        <li id="wAltaProducto" class="hidden"><a href="altaProducto.html">Alta de Producto</a></li>
                        <li id="wAltaUsuarioInterno" class="hidden"><a href="altaUsuarioInterno.html">Alta de Usuario Interno</a></li>
                    </ul>
                </div><!--/.nav-collapse -->
            </div>
        </div>


        <!-- Main jumbotron for a primary marketing message or call to action -->
        <div class="container">
            <div class="jumbotron">     
                <div class="row">
                    <div class="col-md-9">
                        <h1 id="visNombreProducto"></h1>
                    </div>
                    <div id="divUltimaPuja" class="col-md-3">
                        <h4 id="visTextoPuja" style="text-align: center;">Puntos de la última puja</h4>
                        <h3 id="visUltimaPuja" style="text-align: center;"></h3>
                        <h4 id="visTextoCompra" style="text-align: center;">Puntos para compra</h4>
                        <h3 id="visPuntosObtencion" style="text-align: center;"></h3>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <img id="visImagen" src="" alt="120x120" class="img-thumbnail">
                    </div>
                    <div class="col-md-4">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">Descripción</h3>
                            </div>
                            <div class="panel-body">
                                <p id="visDescripcion"></p>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="bloque" id="clock"></div>
                        <button id="botonPujar" type="button" class="btn btn-lg btn-danger btn-block" style="margin-bottom: 10px">Pujar</button>
                        <button id="botonComprar" type="button" class="btn btn-lg btn-danger btn-block" style="margin-bottom: 10px">Comprar</button>
                        <p id="visDueno" style="text-align: center;"></p>
                    </div>
                </div>
                <div class="row" style="margin-top:10px">
                    <div class="col-md-9">
                        <div class="panel panel-default">
                            <div class="panel-heading">
                                <h3 class="panel-title">Ficha Técnica</h3>
                            </div>
                            <div class="panel-body">
                                <p id="visCategoria"></p>
                                <p id="visCaracteristica1"></p>
                                <p id="visCaracteristica2"></p>
                                <p id="visCaracteristica3"></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <footer>
                <p>&copy; JDLS Company 2013</p>
            </footer>
        </div>



    </body>
</html>
